<template>
  <div class="flex-colunm">
    <h1 class="main-title">
      哮喘控制测试问卷 (asthma control test, ACT)
    </h1>
    <p class="desc">
      适用年龄：4-11岁
    </p>
    <el-form ref="form" :rules="rules" :model="form" label-position="top">
      <el-form-item :label="item.name" :key="item.key" v-for="item in dataList"  :prop="item.key">
        <el-radio-group v-model="form[item.key]">
          <el-radio v-for="radio in item.list" :key="radio.value"  :label="radio.value">{{radio.name}}</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-button @click="saveClick">提交问卷</el-button>
    </el-form>
  </div>
</template>
<script>
  import func from "@/util/func";
  export default {
    data(){
      return{
        rules:{
          q1: { required: true, message: '请选择', trigger: 'change' },
          q2: { required: true, message: '请选择', trigger: 'change' },
          q3: { required: true, message: '请选择', trigger: 'change' },
          q4: { required: true, message: '请选择', trigger: 'change' },
          q5: { required: true, message: '请选择', trigger: 'change' },
          q6: { required: true, message: '请选择', trigger: 'change' },
          q7: { required: true, message: '请选择', trigger: 'change' },
        },
        dataList:[
          {
            key:'q1',
            name:'1. 今天你的哮喘怎么样？',
            list:[
              {
                value:0,
                name:'很差'
              },{
                value:1,
                name:'差'
              },{
                value:2,
                name:'好'
              },{
                value:3,
                name:'很好'
              }
            ]
          }, {
            key:'q2',
            name:'2. 当你在跑步、锻炼或运动时，哮喘是个多大的问题？',
            list:[
              {
                value:0,
                name:'这是个大问题，我不能做我想做的事'
              },{
                value:1,
                name:'这是个问题，我不喜欢它'
              },{
                value:2,
                name:'这是个小问题，但我能应付'
              },{
                value:3,
                name:'没问题'
              }
            ]
          },{
            key:'q3',
            name:'3. 你会因哮喘而咳嗽吗？',
            list:[
              {
                value:0,
                name:'会，一直都会'
              },{
                value:1,
                name:'会，大部分时间会'
              },{
                value:2,
                name:'会，有些时候会'
              },{
                value:3,
                name:'从来不会'
              }
            ]
          },{
            key:'q4',
            name:'4. 你会因哮喘而在夜间醒来吗？',
            list:[
              {
                value:0,
                name:'会，所有时间≥3次/日'
              },{
                value:1,
                name:'会，大部分时间'
              },{
                value:2,
                name:'会，有些时间'
              },{
                value:3,
                name:'从来不会'
              }
            ]
          },{
            key:'q5',
            name:'5. 在过去的四周里，您的孩子有多少天有日间哮喘症状？',
            list:[
              {
                value:5,
                name:'没有'
              },{
                value:4,
                name:'1-3天'
              },{
                value:3,
                name:'4-10天'
              },{
                value:2,
                name:'11-18天'
              },{
                value:1,
                name:'19-24天'
              },{
                value:0,
                name:'每天'
              }
            ]
          },{
            key:'q6',
            name:'6. 在过去的四周里，您的孩子有多少天在白天出现喘息声？',
            list:[
              {
                value:5,
                name:'没有'
              },{
                value:4,
                name:'1-3天'
              },{
                value:3,
                name:'4-10天'
              },{
                value:2,
                name:'11-18天'
              },{
                value:1,
                name:'19-24天'
              },{
                value:0,
                name:'每天'
              }
            ]
          },{
            key:'q7',
            name:'7. 在过去的四周里，您的孩子有多少天因为哮喘而在夜里醒来？',
            list:[
              {
                value:5,
                name:'没有'
              },{
                value:4,
                name:'1-3天'
              },{
                value:3,
                name:'4-10天'
              },{
                value:2,
                name:'11-18天'
              },{
                value:1,
                name:'19-24天'
              },{
                value:0,
                name:'每天'
              }
            ]
          },
        ],
        form:{
          q1:'',
          q2:'',
          q3:'',
          q4:'',
          q5:'',
          q6:'',
          q7:'',
        }
      }
    },
    methods:{
      saveClick(){
        this.$refs.form.validate(valid=>{
          if(valid){
            const sum = func.arraySum(Object.values(this.form))
            this.$emit('sum',sum)
            this.$emit('close')
          }
        })
      }
    }
  }
</script>
<style>
  @import "index.css";
</style>
